import React from 'react'
import { Modal } from 'antd'
import TheTable from "@/components/TheTable"
import ThePagination from '@/components/ThePagination';
import { serveAllocationList } from '@/request/callOrder/orderList.js'

export default class ServeTableModal extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      isModalOpen: props.isModalOpen ?? false, //弹窗显示隐藏
      id: props.orderDetailId ?? null, //订单行id
      columns: [
        {
          title: '服务者id',
          dataIndex: "servicerId",
          key: "servicerId",
        },
        {
          title: '服务者姓名',
          dataIndex: "servicerName",
          key: "servicerName",
        },
        {
          title: '类型',
          dataIndex: "provideType",
          key: "provideType ",
          render: (text) => {
            let provideType = ''
            switch (text) {
              case 1:
                provideType = '全职'
                break
              case 2:
                provideType = '兼职'
                break
              default:
                provideType = '-'
            }
            return provideType
          }
        },
        {
          title: '接单服务',
          render: (_, record) => {
            let feedCatStatus = null, feedDogStatus = null, bathCatStatus = null, bathDogStatus = null
            let arr = []
            if (record.feedCatStatus === 0) feedCatStatus = '喂猫'
            if (record.feedDogStatus === 0) feedDogStatus = '喂狗'
            if (record.bathCatStatus === 0) bathCatStatus = '洗猫'
            if (record.bathDogStatus === 0) bathDogStatus = '洗狗'
            arr = [feedCatStatus, feedDogStatus, bathCatStatus, bathDogStatus].filter(item => item !== null)
            if (arr.length > 0) {
              return arr.map(item => {
                return item
              }).join('、')
            } else {
              return '-'
            }

          }
        },
        {
          title: '距离（km）',
          dataIndex: "distance",
          key: "distance",
          render: (text) => {
            return text ? React.$transNum(text, 1, -3) : '-'
          }
        },
        {
          title: '可服务距离（km）',
          dataIndex: "serviceRange",
          key: "serviceRange",
          render: (text) => {
            return text ? React.$transNum(text, 0, -3) : '-'
          }
        },
        {
          title: '分配状态',
          dataIndex: "allocationStatus",
          key: "allocationStatus",
          render: (text) => {
            let allocationStatus = ''
            switch (text) {
              case 'ASSIGNED':
                allocationStatus = '已分配'
                break
              case 'RECEIVING':
                allocationStatus = '已接单'
                break
              case 'REFUSE':
                allocationStatus = '已拒绝'
                break
              default:
                allocationStatus = '-'
            }
            return allocationStatus
          }
        },
        {
          title: '同时段订单数',
          dataIndex: "sameTimeOrderCount",
          key: "sameTimeOrderCount",
          render: (text) => {
            return text ? text : 0
          }
        },
        {
          title: '最近操作时间',
          dataIndex: "recentlyOptTime",
          key: "recentlyOptTime",
          render: (text) => {
            return text ? text : '-'
          }
        }
      ],
      dataSource: [],
      pageData: { pageNo: 1, pageSize: 10 },
      total: 0
    }
  }
  componentDidMount() {
    console.log(this.props.orderDetailId);
    if (this.props.orderDetailId) {
      console.log(this.props.orderDetailId,'dddddd');
      this.getData(this.props.orderDetailId)
    }
  }
  //获取数据
  getData = async (id) => {
    let res = await serveAllocationList({ id })
    if (res.code === 0 && res.data) {
      this.setState({
        dataSource: res.data,
        pageData: {
          pageNo: res.data.pageNo,
          pageSize: res.data.pageSize
        },
        total: res.data.totalCount
      })
    }
  }
  //分页切换
  pageChange = (pageNo, pageSize) => {
        this.setState({ pageData: { pageNo, pageSize } },
      () => {
        this.getData()
      }
    )
  }
  render() {
    const { isModalOpen, columns, dataSource, pageData: { pageNo, pageSize }, total } = this.state
    return (
      <div>
        <Modal width={'70%'} title="分配信息" open={isModalOpen} footer={null} onCancel={() => { this.props.getServerListModal(false) }}>
          <TheTable dataSource={dataSource} columns={columns} rowKey={'servicerId'} />
          <ThePagination
            pageNo={pageNo}
            pageSize={pageSize}
            total={total}
            pageChange={this.pageChange}
          ></ThePagination>
        </Modal>
      </div>
    )
  }
}